<template>
  <el-dialog
    v-model="centerDialogVisible"
    width="44%"
    align-center
    color="white"
    style="
      background-color: #053a6d6e;
      border: 5px solid #a1bf39;
      position: relative;
    "
  >
    <h1 style="color: white">评价</h1>
    <textarea
      v-model="textarea"
      rows="15"
      cols="60"
      style="
        resize: none;
        background-color: rgb(0 0 0 / 0%);
        margin-left: -5%;
        color: white;
        border: 2px solid;
      "
      placeholder="写下你的评论👀'"
      onfocus="this.placeholder=''"
      onblur="this.placeholder='写下你的评论👀'"
    ></textarea>

    <el-button
      type="success"
      @click="pushcomment(), changestate()"
      @keyup.enter="pushcomment()"
      style="
        margin-top: 27%;
        position: absolute;
        margin-left: 5%;
        margin-right: -12%;
      "
    >
      提交
    </el-button>
  </el-dialog>
</template>
      <script>
export default {
  name: "PersonalComment",

  data() {
    return {
      centerDialogVisible: false,
      textarea: "",
      bookId: 0,
      orderFormId:0
    };
  },
  created: function () {
    this.userName = sessionStorage.getItem("userName");
    console.log(this.userName);
    this.userId = sessionStorage.getItem("userId");
    console.log(this.userId);
  },

  methods: {
    loadorders() {
      var data = new FormData();
      data.append("userid", sessionStorage.getItem("userId"));
      this.$axios.post("/getuncomments", data).then((resp) => {
        this.order = resp.data;
      });
    },
    tableRowClassName({ row, rowIndex }) {
      return "row";
    },
    comment(row) {
      console.log(row.bookId);
    },
    pushcomment() {
      var userId = JSON.parse(sessionStorage.getItem("userId"));

      var data = new FormData();
      data.append("userId", userId);
      data.append("bookId", this.bookId);
      data.append("body", this.textarea);
      this.$axios.post("/pushcomment", data).then((resp) => {
        this.textarea = "";
        this.centerDialogVisible = false;
      });
    },
    changestate(){
         var data=new FormData()
         data.append('orderFormId',this.orderFormId)
         this.$axios.post('/changestate',data).then(resp=>{
                  this.$emit('changestate')
                  this.$emit('changeCommenstate')
         })
    }
  },

  mounted: function () {
    this.loadorders();
  },
};
</script>
     
    
    
    <style>
.el-table,
.el-table__expanded-cell {
  background-color: transparent;
}
/* 表格内背景颜色 */
.el-table .row {
  background: transparent !important;
  /* color:white */
}
::-webkit-input-placeholder {
  /* WebKit browsers */
  color: #ffffff;
  font-size: 10px;
}

::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #999;
  font-size: 16px;
}

:-ms-input-placeholder {
  /* Internet Explorer 10+ */
  color: #999;
  font-size: 16px;
}
</style>
     
      
  
  